<template>
	<view class="sign-details u-flex">
		<u-navbar :border-bottom="false" :title="'签约详情'" :title-size="36" :title-bold="true" :title-color="textColor" :background="{background: '#fff'}"></u-navbar>
		<view class="u-p-35 contract-content">
			<view class="u-flex"  v-if="initData.status===0">
				<u-icon name="checkmark-circle" color="#FF551A" size="48"></u-icon>
				<text style="color:#FF551A;font-size: 46rpx;font-weight: bold;margin-left: 20rpx;">待审核</text>
			</view>
			<view class="u-flex"  v-if="initData.status===1">
				<u-icon name="checkmark-circle" color="#FF551A" size="48"></u-icon>
				<text style="color:#FF551A;font-size: 46rpx;font-weight: bold;margin-left: 20rpx;">已生效</text>
			</view>
			<view class="u-flex"  v-if="initData.status===2">
				<u-icon name="checkmark-circle" color="#FF551A" size="48"></u-icon>
				<text style="color:#FF551A;font-size: 46rpx;font-weight: bold;margin-left: 20rpx;">已拒绝</text>
			</view>
		
			<view style="font-size: 36rpx;font-weight: bold;margin: 20rpx 0;">签约内容 <text  v-if="initData.status===4">（草稿）</text></view>
			<view class="u-flex  u-col-top  u-m-b-10">
				<view class="list-title u-flex u-row-between">
					<text>采</text>
					<text>购</text>
					<text>商</text>
				</view>
				<view class="list-text">
					{{initData.buyerName}}
					<view class="u-flex u-font-28" style="color: #FF551A;" @click="previewImg"> 查看营业执照 <u-icon name="arrow-right" color="#ff551a"></u-icon></view>
				</view>
			</view>
			
			<view class="u-flex  u-col-top  u-m-b-10">
				<view class="list-title u-flex u-row-between">
					<text>报</text>
					<text>价</text>
					<text>单</text>
				</view>
				<view class="list-text">
					{{initData.priceTemplateName}}
				</view>
			</view>
			
			<view class="u-flex  u-col-top  u-m-b-10">
				<view class="list-title u-flex u-row-between">
					<text>商</text>
					<text>品</text>
					<text>数</text>
				</view>
				<view class="list-text">
					{{initData.itemsCount}}
					<view class="u-flex u-font-28" style="color: #FF551A;" @click="goPriceItem()"> 查看报价单内商品 <u-icon name="arrow-right" color="#ff551a"></u-icon></view>
				</view>
			</view>
			<view class="u-flex  u-col-top  u-m-b-10">
				<view class="list-title">签约条件</view>
				<view class="list-text">
					{{initData.profile}}
				</view>
			</view>
			<!-- <view class="u-flex  u-col-top  u-m-b-10">
				<view class="list-title">申请理由</view>
				<view class="list-text">
					{{initData.applicationReason}}
				</view>
			</view> -->
			<view class="u-flex u-col-top  u-m-b-10" v-if="initData.collections.length!==0">
				<view class="list-title">支付方式</view>
				<view class="u-m-l-30 u-flex u-flex-wrap" style="flex:1;">
					<view class="u-flex u-m-r-20 u-m-b-10" v-for="item in initData.collections" :key="item.id">
						<image src="/static/payment/weixuanze.png" v-if="item.type == null" mode="" class="paymethod-logo"></image>
						<image src="/static/payment/weixin.png" v-if="item.type == 0||item.type == 7||item.type == 5" mode="" class="paymethod-logo"></image>
						<image src="/static/payment/zhifubao.png" v-if="item.type == 1||item.type == 11||item.type == 13" mode="" class="paymethod-logo"></image>
						<image src="/static/payment/xianxiazhifu.png" v-if="item.type == 3||item.type == 4" mode="" class="paymethod-logo"></image>
						<image src="/static/payment/gonghang.png" v-if="item.type == 10||item.type == 6" mode="" class="paymethod-logo"></image>
						<text style="font-size: 26rpx;font-weight: bold; color: #333;margin-left: 10rpx;">{{item.name}}</text>
					</view>
				</view>
				
			</view>
			
			<view class="u-flex u-col-top  u-m-b-10">
				<view class="list-title">运&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;费</view>
				<view class="list-text">
					<!-- 起购到付额 100000 元 包邮自提额 200000 元 包邮包送额 300000 元 -->
					<view>起购到付额 {{initData.baseValue?initData.baseValue+'元':'未设置'}} </view>
					<view>包邮自提额 {{initData.freeDeliveryValue?initData.freeDeliveryValue+'元':'未设置'}} </view>
					<view>包邮包送额 {{initData.freeShippingValue?initData.freeShippingValue+'元':'未设置'}} </view>
				</view>
			</view>
			<view class="u-flex u-col-top  u-m-b-10">
				<view class="list-title">售&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;后</view>
				<view class="list-text">
					{{initData.openAfterSales?'已开启售后':'未开启售后'}}
				</view>
			</view>
			<view class="u-flex  u-col-top  u-m-b-10"  v-if="initData.status===1">
				<view class="list-title">生效日期</view>
				<view class="list-text">
					{{initData.settlementMethod === 0?'先款后货':'先货后款'}}
				</view>
			</view>
			<view v-if="initData.status===2">
				<view style="font-size: 36rpx;font-weight: bold;margin: 20rpx 0;">拒绝原因</view>
				<view class="list-text">
					{{initData.rejectReason}}
				</view>
			</view>
		</view>
		<!-- <view class="u-flex u-p-35 contact-bottom">
			<view class="apply-btn"  v-if="initData.status===0" @click="cancelApplyFn()">审批</view>
		</view> -->
		<akLoading isFullScreen :active="loading"></akLoading>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				initData:{},
				loading:false,
			}
		},
		onLoad(options) {
			this.initData = JSON.parse(options.data);
			console.log(this.initData);
		},
		methods:{
			goPriceItem(){
				this.$mRouter.push({
					route: '/pages/purchase/mySale/priceItem?id='+this.initData.id,
				})
			},
			// 撤回申请
			async cancelApplyFn(){
				this.loading = true;
				let params = {
					id:this.initData.id
				}
				const res = await this.$newHttp.put('api/v1.2/Shop/PurchaseRevokeApplication', params );
				this.loading = false;
				if(res.code == 200){
					this.loadError('撤回申请成功');
					uni.$emit('reloadSignList', 2);
				}else{
					this.$u.toast('撤回申请失败，请重试或联系客服处理~');
				}
			},
			// 再次申请
			async reloadApplyFn(){
				this.loading = true;
				let params = {
					signingHistoryId:this.initData.id
				}
				const res = await this.$newHttp.put('api/v1.2/Shop/ResubmitApplication', params );
				this.loading = false;
				if(res.code == 200){
					this.loadError('再次申请成功');
					uni.$emit('reloadSignList', 1);
				}else{
					this.$u.toast('撤回申请失败，请重试或联系客服处理~');
				}
			},
			// 查看营业执照
			previewImg() {
				let ary = [];
				ary.push(this.initData.businessLicenseUrl);
				uni.previewImage({
					current: 1,
					urls: ary,
					indicator: 'number',
					loop: true
				});
			},
		},
	}
</script>

<style lang="scss" scoped>
	.sign-details{
		flex-direction: column;
		min-height: 100%;
		.contract-content{
			width: 100%;
			background-color: #fff;
			flex:1;
			.list-title{
				color: #666;
				font-size: 30rpx;
				width:120rpx;
			}
			.list-text{
				color: #333;
				font-size: 30rpx;
				margin-left: 30rpx;
				flex:1;
			}
			.paymethod-logo{
				width: 48rpx;
				height: 48rpx;
			}
		}
		.used-progress{
			::v-deep .u-active{
				background:linear-gradient(90deg, #FFBB1A, #FF551A);
			}
		}
		.contact-bottom{
			background-color: #fff;
			width: 100%;
			.apply-btn{
				width: 100%;
				height: 90rpx;
				line-height: 90rpx;
				text-align: center;
				border-radius: 45rpx;
				background-color: #ffbb1a;
			}
		}
	}
</style>